<template>
  <div id="bg">
<div id="index">
  <h1 class="text">Welcome Vhr！</h1>
<!--  <el-button @click="test">主页</el-button>-->
  <div>
  <div>
    <el-button @click="show2 = !show2" round type="warning" icon="el-icon-sunrise-1"></el-button>
    <br>
    <br>
      <transition name="el-zoom-in-center">
        <div class="text" v-show="show2" >vhr 是一款前后端分离的 web程序。后端基于SpringBoot+SpringSecurity+SpringDataJpa;
          <br>
          <br/>
          <br/>
          <el-button @click="login" round type="primary">点击登录</el-button>
        </div>

      </transition>
    </div>
  </div>
</div>
  </div>
</template>

<script>
export default {
  name: "index",
  data(){
    return{
      show2:true
    }
  },
  methods:{
    login(){
      this.$router.push("login");
    },
    register(){
      this.$router.push("register");
    },
    test(){
      this.$router.push("personnel");
    }
  },
  created() {
    this.show2=false;
  }
}
</script>

<style scoped>
#index{
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 250px;
}
#bg{
  background-image:url(../assets/image/5.png);
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
  background-attachment: local;
  background-repeat: no-repeat;
  background-size: cover;
  float: left;
  -o-background-size: cover;
  background-position: center;
}
.text{
  font-family: Hiragino Sans GB;
  color: mediumspringgreen;
}

</style>